<!DOCTYPE html>
<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="maximum-scale=1.0, minimum-scale=1.0, user-scalable=0, initial-scale=1.0, width=device-width" />

    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <link rel="stylesheet" href="../../css/api.css">

    <link rel="stylesheet" href="../../css/base_bai/base.css">


    <title>红包</title>

    <style type="text/css">

        html, body{font-size: 100%}
        .redPack,#app{width: 100%;height: 100%;background: #9366F7}
        img{width: 90%;height: 90%;}

        .redPack [red_1]{text-align: right;height: 10%}
        .redPack [red_1] span{    border: 1px solid white;  padding: .2rem 1rem;  border-radius: 2rem;  color: white;line-height: 1.5rem;  margin: .5rem .5rem 0rem 0;}
        .redPack [red_2]{text-align: center;height: 20%}
        .redPack [red_2] img{width: 60%;  height: 5.5rem;}
        .redPack [red_2] {width: 100%;  position: relative;  top: 0px;  animation: red_2 .5s 1;  -webkit-animation: red_2 .5s 1;}
        @keyframes red_2 { 0% {  top:-100%;  }  50% {  top: -50%;  }  100% {  top: 0%;  }   }
        @-webkit-keyframes red_2 {    0% {  top:-20%;  }  50% {  top: -10%;  }  100% {  top: 0%;  }      }

        .redPack [red_3]{ position: fixed;width: 100%;    height: 70%;  bottom: 0px; animation: red_3 .5s 1;  -webkit-animation: red_3 .5s 1;display: flex;  justify-content: center;}
        .redPack [red_3] img{    position: absolute;  bottom: 0;}
        @keyframes red_3 { 0% {  bottom:-100%;  }  50% {  bottom: -50%;  }  100% {  bottom: 20%;  }    }
        @-webkit-keyframes red_3 {    0% {  bottom:-100%;  }  50% {  bottom: -50%;  }  100% {  bottom: 20%;  }      }







    </style>

</head>

<body>
    <div id="app" v-cloak>

      <div class="redPack">
      <div red_1><span>我的红包</span></div>
      <div red_2><img src="../../image/rob_index_1.png" /></div>
      <div red_3 @click=' openWin("video", "video")'><img src="../../image/rob_index_2.png" /></div>

      </div>


    </div>

</body>
<script src="../../script/api.js"></script>
<script src="../../script/base_bai/vue.js"></script>
<script src="../../script/base_bai/vant.js"></script>
<script src="../../script/base_bai/area.js"></script>
<script src="../../script/base_bai/base.js"></script>
<script src="../../script/base_bai/temp.js"></script>
<script type="text/javascript">
    apiready = function() {
        headerH = $api.fixStatusBar($api.byId('app'));

        Vue.prototype.$ac = api;

        initVue()

    };
if(BrowserType()=='pc'){
    initVue()
}

    function initVue() {
        new Vue({
            el: '#app',
            data: {},
            methods: {



            }
        });

    }
</script>

</html>
